src/routes/blog/[id=int]/+page.svelte


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

<script lang="ts">
  import { replaceState } from '$app/navigation';
  import { onMount, tick } from 'svelte';

  import type { PageProps } from './$types';
  import { resolve } from '$app/paths';
  import { page } from '$app/state';
  import { forceTrailingSlash } from '$/lib';
  import Post from '$/lib/blog/Post.svelte';

  let { data }: PageProps = $props();

  let route = () =>
    forceTrailingSlash(
      resolve('/blog/[id=int]-[slug]', {
        id: data.post.metadata.id.toString(),
        slug: data.post.metadata.slug,
      }),
    ) + `${page.url.search}${page.url.hash}`;

  onMount(() => {
    tick().then(() => replaceState(route(), page.state));
  });
</script>

<svelte:head>
  <link rel="canonical" href={new URL(route(), page.url).href} />
</svelte:head>

<Post post={data.post} filename={data.filename} />